<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    switchFullscreen
    @ok="handleOk"
    :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
    @cancel="handleCancel"
    cancelText="关闭">

    <store-auth-amazon-form ref="realForm" v-if="type === ''" :storeSiteData="storeSiteData" :costCenterList="costCenterData" @ok="submitCallback" :disabled="disableSubmit"></store-auth-amazon-form>
    <store-auth-amazon-config-form v-if="type && type === 'config'" ref="realConfigForm" @ok="submitCallback" :disabled="disableSubmit"></store-auth-amazon-config-form>
  </j-modal>
</template>

<script>

  import StoreAuthAmazonForm from './StoreAuthAmazonForm'
  import StoreAuthAmazonConfigForm from './StoreAuthAmazonConfigForm'
  export default {
    name: 'StoreAuthAmazonModal',
    components: {
      StoreAuthAmazonForm,
      StoreAuthAmazonConfigForm,
    },
    props:{
      storeSiteData:{
        type:Array,
        default:()=>[]
      },
      costCenterData:{
        type:Array,
        default:()=>[]
      }
    },
    data () {
      return {
        title:'',
        width:900,
        visible: false,
        disableSubmit: false,
        type:''
      }
    },
    methods: {
      add (storeSiteData) {
        this.type = '';
        this.visible=true
        this.$nextTick(()=>{
          this.$refs.realForm.add(storeSiteData);
        })
      },
      edit (record,storeSiteData) {
        this.type = '';
        this.visible=true
        this.$nextTick(()=>{
          this.$refs.realForm.edit(record,storeSiteData);
        })
      },
      editConfig (record) {
        this.type = 'config';
        this.visible=true
        this.$nextTick(()=>{
          this.$refs.realConfigForm.edit(record);
        })
      },
      close () {
        this.$emit('close');
        this.visible = false;
      },
      handleOk () {
        if(this.type === 'config'){
          this.$refs.realConfigForm.submitForm();
        }else {
          this.$refs.realForm.submitForm();
        }
      },
      submitCallback(){
        this.$emit('ok');
        this.visible = false;
      },
      handleCancel () {
        this.close()
      }
    }
  }
</script>
<style scoped>
/deep/.ant-modal-body{
  padding:15px 24px
}
</style>